<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<!-- 适配移动端屏幕 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
	<title>京东</title>
	<link rel="stylesheet" href="css/base.css">
	<link rel="stylesheet" href="css/index.css">
	<style type="text/css">
		.box {
			width: 500px;
			height: 500px;
			background: yellow;
		}
	</style>
</head>
<body>
<div class="box">
	
</div>

<script type="text/javascript">
	/*
	var box = document.getElementsByClassName("box")[0];
	box.onclick = function(){
		alert(123);
	}
	*/
	var box = document.getElementsByClassName("box")[0];

// 判断左滑还是右滑
	var x = 0;

	box.addEventListener('touchstart',function(event){
		console.log("触摸开始");
		x++;
	});


	box.addEventListener('touchend',function(){
		setTimeout(function(){
			x = 0;
		},500);
		if (x == 2) {
			console.log("触摸结束，双击");
			x = 0;
		}
	});

</script>


</body>
</html>